var id = function(el) {          
  return document.getElementById(el);        
},
//通过id()函数，获取dom节点
c = id('photo-list');
//如果c非null
if(c) {
  var ul = id('scroll'),
  lis = ul.getElementsByTagName('li'),
  //获取有多少个li
  itemCount = lis.length,
  //获得每个img容器的宽度
  width = lis[0].offsetWidth, 
  marquee = function() {
    //每次滚动条向左滚动2个单位
    c.scrollLeft += 2;
    //当 c.scrollLeft 和 width 相等时，即当滚动条滚动长度等于width时，把第一个img追加到ul最后面
    if(c.scrollLeft % width <= 1){  
      ul.appendChild(ul.getElementsByTagName('li')[0]);
      //滚动置0。当滚动条位于最左侧时，位置是 0。
      c.scrollLeft = 0;
    };
  },
  //数值越大越慢
  speed = 50; 
  //加载完后设置容器长度 
  ul.style.width = width*itemCount + 'px'; 

  //让浏览器每50毫秒调用一次Marquee函数,即每50毫秒移动一次滚动条      
  var timer = setInterval(marquee, speed);

  //当鼠标移动到demo控件上时停止调用Marquee函数
  c.onmouseover = function() {
    clearInterval(timer);
  };

  //当鼠标从id="photo-list"的div上移开始，继续每30毫秒调用一次Marquee函数
  c.onmouseout = function() {
    timer = setInterval(marquee, speed);
  };
};